import Vue from 'vue'
import VueRouter from 'vue-router'
//导入一级组件
import Login from '@/views/Login.vue'
import Register from '@/views/Register.vue'
import Layout from '@/views/Layout.vue'
import Detail from '@/views/Detail.vue'
//二级组件
import Article from '@/views/Article.vue'
import Like from '@/views/Like.vue'
import Collect from '@//views/Collect.vue'
import User from '@/views/User.vue'
import Test from '@/views/Test.vue'
import { getToken } from '@/utils/storage'
import { Toast } from 'vant'
Vue.use(VueRouter)
//配置路由规则
const routes = [
{path:'/login',component:Login},
{path:'/register',component:Register},
{path:'/detail/:id',component:Detail},
{path:'/test',component:Test},
{
  path:'/',
  redirect:'/article',
  component:Layout,
children:[
  {path:'article',component:Article},
  {path:'like',component:Like},
  {path:'collect',component:Collect},
  {path:'user',component:User},
]
},
]

const router = new VueRouter({
  routes
})
// 1. from 你从哪里来， 从哪来的路由信息对象
// 2. to   你往哪里去， 到哪去的路由信息对象
// 3. next() 是否放行，如果next()调用，就是放行 => 放你去想去的页面
// 4. next(路径) 拦截到某个路径页面
// //================
//通过中设置导航前置守卫  控制是否允许访问某页面
//作用：控制页面是都允许访问
//定义白名单
const whteLst = ['/login','/register']
router.beforeEach((to,from,next)=>{
const token = getToken()
//判断用户有没有token  有  直接放行
if(token||whteLst.includes(to.path)){
  next()
  return
}
  //没有（游客） 如果是白名单中的页面  直接放行
  if (whteLst.includes(to.path)) {
    next()
    return
  }
  //没有（游客）  且在访问需要权限的访问的页面  直接拦截到登录
  Toast.fail('登陆超时,请重新登录')
  //
  next('/login')
})
export default router
